{#
  This Source Code Form is subject to the terms of the Mozilla Public
  License, v. 2.0. If a copy of the MPL was not distributed with this
  file, You can obtain one at https://mozilla.org/MPL/2.0/.
#}

{% from "macros-protocol.html" import split with context %}

{% extends "firefox/whatsnew/base.html" %}

{% block page_css %}
  {{ css_bundle('protocol-split') }}
  {{ css_bundle('firefox_whatsnew_137_vertical_tabs') }}
{% endblock %}

{% if LANG == 'de' %}
  {% set main_title = 'Neu: Mehr Übersicht, weniger Tab-Chaos' %}
  {% set main_tagline = 'Mit der neuen Firefox-Seitenleiste behältst du den Überblick: Tabs einfach zur Seite schieben, Lieblingsseiten anpinnen und deinen KI-Assistenten immer parat haben.' %}
  {% set main_cta = 'Seitenleiste aktivieren' %}
{% elif LANG == 'fr' %}
  {% set main_title = 'À la une ! Moins de désordre et plus de focus grâce aux onglets verticaux' %}
  {% set main_tagline = 'Le panneau latéral vous permet désormais de déplacer vos onglets sur le côté, d’épingler vos favoris et de garder votre assistant IA sous la main.' %}
  {% set main_cta = 'Activer le panneau latéral' %}
{% else %}
  {% set main_title = 'New! Less clutter and more focus with vertical tabs' %}
  {% set main_tagline = 'Firefox’s new sidebar lets you move tabs to the side, pin key sites and keep your AI assistant handy.' %}
  {% set main_cta = 'Enable the new sidebar' %}
{% endif %}

{% block wnp_content %}
  {% call split(
    block_class='wnp-content-main mzp-l-split-center-on-sm-md',
    body_class='wnp-content-wrapper',
    media_include='firefox/whatsnew/includes/fx137/video.html',
    media_class='wnp-video-wrapper mzp-l-split-h-center',
    media_after=True
    ) %}
      <h2 class="wnp-content-title mzp-u-title-sm">{{ main_title }}</h2>
      <p class="wnp-content-tagline">{{ main_tagline }}</p>
      <p class="wnp-main-cta"><button data-cta-text="Enable the new sidebar" data-cta-position="primary" class="mzp-c-button mzp-t-product">{{ main_cta }}</button></p>
  {% endcall %}

  <section class="wnp-footer">
    <p class="wnp-sign-off">{{ ftl('whatsnew-signoff') }}</p>
    {% include "firefox/whatsnew/includes/mofo-donate-cta.html" %}
  </section>
{% endblock %}

{% block js %}
  {{ js_bundle('firefox_whatsnew_137') }}
  {{ js_bundle('data_videoengagement') }}
{% endblock %}
